<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
	<meta charset="<?php bloginfo( 'charset' ); ?>" />
	<title><?php
	/*
	 * Print the <title> tag based on what is being viewed.
	 */
	global $page, $paged;

	wp_title( '|', true, 'right' );

	// Add the blog name.
	bloginfo( 'name' );

	// Add the blog description for the home/front page.
	$site_description = get_bloginfo( 'description', 'display' );
	if ( $site_description && ( is_home() || is_front_page() ) )
		echo " | $site_description";

	// Add a page number if necessary:
	if ( $paged >= 2 || $page >= 2 )
		echo ' | ' . sprintf( __( 'Page %s', 'twentyten' ), max( $paged, $page ) );

	?></title>
	<link rel="stylesheet" type="text/css" href="<?php bloginfo('stylesheet_directory'); ?>/css/style.css" />
	<!--[if IE 7]>
		<link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo('stylesheet_directory'); ?>/css/ie7.css" />
	<![endif]-->
	<link rel="stylesheet" type="text/css" href="<?php bloginfo('stylesheet_directory'); ?>/css/jquery.fancybox.css" />
	<link rel="stylesheet" href="<?php bloginfo('stylesheet_directory'); ?>/css/nivo-slider.css" type="text/css" media="screen" />
	<link rel="stylesheet" href="<?php bloginfo('stylesheet_directory'); ?>/css/themes/bar/bar.css" type="text/css" media="screen" />
	<link rel="stylesheet" href="<?php bloginfo('stylesheet_directory'); ?>/css/themes/light/light.css" type="text/css" media="screen" />
	<link href='http://fonts.googleapis.com/css?family=PT+Sans' rel='stylesheet' type='text/css'>
	</head>
<body>
	<div id="container-wrapper">
		<div id="container">
			<div id="header">
				<h1><a href="<?php echo home_url( '/' ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a></h1>
				<img src="<?php bloginfo('stylesheet_directory'); ?>/images/avatar.jpg" alt="Logo" id="logo" />
				<p><?php bloginfo( 'description' ); ?></p>
			
				<div id="float-button">
					<a href="index.html"><img src="<?php bloginfo('stylesheet_directory'); ?>/images/status.png" alt=""/></a>
				</div>
			</div> <!---end-header-->
		
			<div id="main">
				<div id="helloThere">
					<?php if(!dynamic_sidebar('middle-page-sidebar')) { ?>
					<h2>About me</h2>
					<p> Mauris vulputate metus eu nisl. Praesent placerat. Mauris vitae erat id ante viverra sodales. Proin tincidunt porta velit. Praesen tplacerat. Mauris vitae erat id ante viverra sodales. Prointin cid unt porta velit. Mauris vitae erat id ante viverra sodales. </p>
					<?php } ?>
				</div> <!---end-helloThere-->
				<div id="portofolio">
					<h2> Portofolio </h2>
						<ul>
							<?php 
								while ( have_posts() ) : the_post(); 
									$thumb_image_url = get_bloginfo('stylesheet_directory') . '/images/portfolio/1.png';
									
									if ( has_post_thumbnail() ) { // check if the post has a Post Thumbnail assigned to it.
										$thumb_image_url = wp_get_attachment_image_src( get_post_thumbnail_id(), 'portf-thumb');
									}
							?>
									<li><a href="<?php echo get_permalink(); ?>" class="fancybox fancybox.ajax" rel="fancybox-gallery"><?php the_post_thumbnail('portf-thumb'); ?></a></li>
							<?php endwhile; ?>
						</ul>
				</div> <!--end-portofolio-->
				<div id="helloThere">
					<h2>Contact</h2>
					<div>
						<div class="col">
							<?php if(!dynamic_sidebar('bottom-page-sidebar-1')) { ?>
								
								
							<?php } ?>
						</div>
						<div class="col">
							<?php if(!dynamic_sidebar('bottom-page-sidebar-2')) { ?>
							<div id="socialNetwork">
								<ul>
								<li class="home"><a href="#"><img src="<?php bloginfo('stylesheet_directory'); ?>/images/twitter.png" alt="Twitter" /></a></li>
								<li><a href="#"><img src="<?php bloginfo('stylesheet_directory'); ?>/images/facebook.png" alt="Facebook" /></a></li>
								<li><a href="#"><img src="<?php bloginfo('stylesheet_directory'); ?>/images/rss.png" alt="Rss" /></a></li>
								<li><a href="#"><img src="<?php bloginfo('stylesheet_directory'); ?>/images/su.png" alt="Su" /></a></li>
								<li><a href="#"><img src="<?php bloginfo('stylesheet_directory'); ?>/images/wordpress.png" alt="Wordpress" /></a></li>
								</ul>
							</div> <!--end-socialNetwork-->
							<?php } ?>
							<div class="ggmap" id="ggmap1" data_latitude="47.660937" data_longitude="9.569803" data_address="Danang, Vietnam">
							</div>
						</div>
					</div>
					<div style="clear:both;"></div>
				</div>
				
			
			
				
			</div> <!--end-main-->
		</div> <!--end-container-->	
	</div> <!--end-container-wrapper-->
	<div id="site">
		<div id="site-generator">
			<?php do_action( 'twentyeleven_credits' ); ?>
			<a href="<?php echo esc_url( __( 'http://wordpress.org/', 'twentyeleven' ) ); ?>" title="<?php esc_attr_e( 'Semantic Personal Publishing Platform', 'twentyeleven' ); ?>" rel="generator"><?php printf( __( 'Proudly powered by %s', 'twentyeleven' ), 'WordPress' ); ?></a>
		</div>
	</div>

	<script type="text/javascript" src="<?php bloginfo('stylesheet_directory'); ?>/js/jquery-1.8.2.min.js"></script>
	<script type="text/javascript" src="<?php bloginfo('stylesheet_directory'); ?>/js/jquery.fancybox.pack.js"></script>
	<script type="text/javascript" src="<?php bloginfo('stylesheet_directory'); ?>/js/jquery.nivo.slider.pack.js"></script>
	<script type="text/javascript" src="<?php bloginfo('stylesheet_directory'); ?>/js/jquery.tinyscrollbar.min.js"></script>
    
	<script type="text/javascript">
		jQuery(document).ready(function() {
			jQuery("a.fancybox").fancybox({
				'closeBtn' : false,
				'scrollOutside' : false,
				'arrows' : false,
				'scrolling' : 'no',
				'padding' : 0,
				'margin' : 0,
				'autoSize' : false,
				'width' : 630,
				'beforeShow' : function(current, previous){
					Cufon.refresh();
					$('.slider').nivoSlider({effect : 'random'});
					$('.scroll').tinyscrollbar();
				}
			});
		});
	</script>

	<!--cufon here-->
	<script type="text/javascript" src="<?php bloginfo('stylesheet_directory'); ?>/js/cufon-yui.js"> </script>
	<script type="text/javascript" src="<?php bloginfo('stylesheet_directory'); ?>/js/lobster.cufonfonts.js"> </script>
	<script type="text/javascript">
		Cufon.replace("h1,h2,h3"); 
	</script>
	<!--cufon end-->
</body>
</html>